<% content_for :header do %>
  <h1 class="header-title big"><%= t('.title') %></h1>
<% end %>

<section class='section'>
  <div class="inner">

    <h2 class='header-title header-subtitle'>These stories are submitted by GFW users to report<br />what is happening in forests on the ground.</h2>

    <%= link_to (content_tag :span, t('stories.more_stories.submit_your')), new_story_path, {:class => "btn dark_glow new_btn"} %>

    <ul class="featured_stories">
      <% @visible.each do |story| %>
        <li class='featured_story <%= cycle('left', 'right') %>'>
          <div class="featured_story-content">
            <h2><%= link_to story['title'], story_path(story['id']), :class => 'featured_story-title' %></h2>
            <p><%= truncate(story['details'], :length => 295) %></p>
            <%= link_to t('.read_more'), story_path(story['id']) %>
          </div>

          <a href="<%= story_path(story['id']) %>">
            <div class="frame">
              <img src="<%= story_image_or_map(story['media'], "#{story['lat']}, #{story['lng']}") %>" alt="<%= story['title'] %>" />
              <p style="background-image: url('<%= story_image_or_map(story['media']) %>');margin:0"></p></div>
          </a>
        </li>
      <% end %>
    </ul>

    <div class="section-footer">
      <%= link_to content_tag(:span, t('.previous')), previous_page_link(@page), :class => "btn dark_glow previous_stories" if @page > 1%>
      <%= link_to content_tag(:span, t('.next')), next_page_link(@page), :class => "btn dark_glow next_stories" unless last_page?%>
    </div>
  </div>
</section>

<%= render 'more_stories' %>
